/* 1. 剥掉系统默认 */
.high-todo {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 1rem;
    height: 1rem;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;

    /* 2. 自定义边框 */
    border: 1px solid var(--theme-errorColor);   /* 使用主题错误色 */
    border-radius: 4px;
    background: var(--theme-bgColor);
    position: relative;
}

/* 3. 选中时背景变红 + 画白勾 */
.high-todo:checked {
    background: var(--theme-errorColor);
    border-color: var(--theme-errorColor);
}
.high-todo:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* 4. 聚焦时补一条红晕（可删） */
.high-todo:focus-visible {
    outline: 1px solid var(--theme-errorColor);
    outline-offset: 1px;
}
/* 4. 聚焦时补一条红晕（可删） */
.high-todo:hover {
    border: 1px solid var(--theme-errorColor);
}

/* 1. 剥掉系统默认 */
.medium-todo {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 1rem;
    height: 1rem;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;

    /* 2. 自定义边框 */
    border: 1px solid var(--theme-warningColor);   /* 使用主题警告色 */
    border-radius: 4px;
    background: var(--theme-bgColor);
    position: relative;
}

/* 3. 选中时背景变红 + 画白勾 */
.medium-todo:checked {
    background: var(--theme-warningColor);
    border-color: var(--theme-warningColor);
}
.medium-todo:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* 4. 聚焦时补一条红晕（可删） */
.medium-todo:focus-visible {
    outline: 1px solid var(--theme-warningColor);
    outline-offset: 1px;
}

.medium-todo:hover {
    border: 1px solid var(--theme-warningColor);
}




/* 1. 剥掉系统默认 */
.low-todo {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 1rem;
    height: 1rem;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;

    /* 2. 自定义边框 */
    border: 1px solid var(--theme-primaryColor);   /* 使用主题主色 */
    border-radius: 4px;
    background: var(--theme-bgColor);
    position: relative;
}

/* 3. 选中时背景变红 + 画白勾 */
.low-todo:checked {
    background: var(--theme-primaryColor);
    border-color: var(--theme-primaryColor);
}
.low-todo:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* 4. 聚焦时补一条红晕（可删） */
.low-todo:focus-visible {
    outline: 1px solid var(--theme-primaryColor);
    outline-offset: 1px;
}
/* 4. 聚焦时补一条红晕（可删） */
.low-todo:hover {
    border: 1px solid var(--theme-primaryColor);
}
.cursor-pointer {
    cursor: pointer;
}

/* 为TodoItem列表项添加悬停效果，使用主题定义的悬停高亮颜色 */
.highlight:hover {
    background-color: var(--theme-hoverColor);
}

/* 清除Ant Design Input组件聚焦时的边框 */
.ant-input:focus,
.ant-input-focused {
    box-shadow: none;
    border-color: transparent;
}
.selected-task{
    background-color: var(--theme-hoverColor) !important;
}